<!DOCTYPE html>
<style>
#test {
  font-size: 10vw;
}
</style>
<script src="../../resources/js-test.js"></script>
<div id="test"></div>

<script>
description('This test checks that getComputedStyle returns pixel values for viewport units that are affected by page zoom (aka browser zoom).');

function zoomBy(zoomFactor)
{
    while (zoomFactor > 0) {
        testRunner.zoomPageIn();
        zoomFactor--;
    }
    while (zoomFactor < 0) {
        testRunner.zoomPageOut();
        zoomFactor++;
    }
}

if (window.testRunner) {
    var zoomLevels = [-4, -2, -1, 0, 1, 3, 5];
    for (zoom in zoomLevels) {
        zoomBy(zoomLevels[zoom]);
        shouldBeCloseTo('parseFloat(getComputedStyle(test).fontSize)', window.innerWidth / 10, 1, false);
        zoomBy(-zoomLevels[zoom]);
    }
}
</script>
